<style>
    .layui-btn:not(.layui-btn-lg ):not(.layui-btn-sm):not(.layui-btn-xs) {height:34px;line-height:34px;padding:0 8px;}
</style>
<div class="layuimini-container layuimini-page-anim">
    <div class="layuimini-main">
           <div class="layui-btn-container" style="display: inline-block;">
               <button id="topAdd" class="layui-btn layui-btn-sm layui-btn-primary">
                   <i class="layui-icon" ></i>新增顶部节点
               </button>   
            <table id="demoTreeTable1"></table>
    </div>
</div>

<!-- 表格操作列 -->
<script type="text/html" id="demoTreeTableBar1">
	{{#  if(d.type == 1||d.type == 2){ }}
	   <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="add">新增</a>
	 {{#  } }}
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
	{{#  if(d.child.length == 0 ){ }}
	   <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	 {{#  } }}
    
	
</script>

<!-- 表格状态列 -->
<script type="text/html" id="demoTreeTableState1">
	{{#  if(d.type != 3){ }}
    <input type="checkbox" lay-filter="ckState" value="{{d.pid}}" lay-skin="switch"
           lay-text="显示|不显示" {{d.state==1?'checked':''}}/>
		
		{{#  } }}   
</script>
<script type="text/html" id="demoTreeTableState2">
    {{#  if(d.type == 1){ }}
       <span>菜单</span>
     {{#  } else if(d.type == 2){ }}
       <span>页面</span>
     {{#  } else { }}
	   <span>接口</span>
	 {{#  } }}
</script>

<div class="page-loading">
    <div class="ball-loader sm">
        <span></span><span></span><span></span><span></span>
    </div>
</div>
<script>
    layui.use(['layer', 'util', 'treeTable','hsw','miniPage','form'], function () {
            var $ = layui.jquery;
            var layer = layui.layer;
            var util = layui.util;
            var treeTable = layui.treeTable;
			var hsw = layui.hsw;
			var miniPage = layui.miniPage;
			var form = layui.form;
           
			/* 初始化select*/
			hsw.hsw_post(HSW_API_MANAGE_PEIMISSION_TREE, {}, function(data) {
			
				// 渲染表格
				var insTb = treeTable.render({
				    elem: '#demoTreeTable1',
				    data: data,
					toolbar: '#toolbarDemo',
				    tree: {
				        iconIndex: 2
				    },
				    cols: [
				        {type: 'checkbox'},
				        {field: 'pid', title: 'ID', width: 160},
				        {field: 'name', title: 'name', width: 240},
						{field: 'code', title: 'code', width: 240},
						{field: 'lastUpdateTime', title: '上次修改时间', width: 180},
						{field: 'url', title: '地址', width: 180},
						{field: 'sort', title: '排序', width: 70},
				        {templet: '#demoTreeTableState1', title: '状态', width: 100},
						{templet: '#demoTreeTableState2', title: '类型', width: 80},
						{field: 'remark', title: '备注', width: 100},
				        {align: 'center', toolbar: '#demoTreeTableBar1', title: '操作', width: 160}
				    ],
				    style: 'margin-top:0;'
				});
				insTb.expandAll();
			});
			
			form.on('switch(ckState)', function(data){
			  console.log(data.elem.checked); //开关是否开启，true或者false
			  
			  if(data.elem.checked){
				  ckState = 1;
			  }else{
				  ckState = -1;
			  }
			  
			  /* 初始化select*/
			  hsw.hsw_post(HSW_API_MANAGE_PEIMISSION_EDIT_STATE.replace("pid",data.value), {state:ckState}, function(tree) {
			  		layer.msg('操作成功');	
			  });
			  
			});  
			
			
			$('#topAdd').click(function () {
			            var content = miniPage.getHrefContent("page/manage/permission/add.html");
			            var openWH = miniPage.getOpenWidthHeight();
			            				
			            var index = layer.open({
			            	title: '权限新增',
			            	type: 1,
			            	shade: 0.2,
			            	maxmin:true,
			            	shadeClose: true,
			            	area: [openWH[0] + 'px', openWH[1] + 'px'],
			            	offset: [openWH[2] + 'px', openWH[3] + 'px'],
			            	content: content,
			            	success:function(layero,index){
			            		
			            		addInit(null);
			            	}
			            });
			            $(window).on("resize", function () {
			            	layer.full(index);
			            });
			        });
			
		
			treeTable.on('tool(demoTreeTable1)', function (obj) {
                var event = obj.event;
				if (event == 'add') {
				    
					var content = miniPage.getHrefContent("page/manage/permission/add.html");
					var openWH = miniPage.getOpenWidthHeight();
									
					var index = layer.open({
						title: '权限新增',
						type: 1,
						shade: 0.2,
						maxmin:true,
						shadeClose: true,
						area: [openWH[0] + 'px', openWH[1] + 'px'],
						offset: [openWH[2] + 'px', openWH[3] + 'px'],
						content: content,
						success:function(layero,index){
							console.log(obj.data);
							addInit(obj.data);
						}
					});
					$(window).on("resize", function () {
						layer.full(index);
					});
					
					
				} else  if (event == 'del') {
					hsw.hsw_post(HSW_API_MANAGE_PEIMISSION_DEL.replace("pid",obj.data.pid), {}, function(data) {
						layer.msg('操作成功，即将刷新页面', {
							time: 3000 //
						}, function() {
							hsw.hsw_html_reload(0);
						});	
					});
					
                } else if (event == 'edit') {
                   var content = miniPage.getHrefContent("page/manage/permission/edit.html");
                   var openWH = miniPage.getOpenWidthHeight();
                   var index = layer.open({
                       title:"权限修改",
                       type: 1,
                       shade: 0.2,
                       maxmin:true,
                       shadeClose: true,
                       area: [openWH[0] + 'px', openWH[1] + 'px'],
                       offset: [openWH[2] + 'px', openWH[3] + 'px'],
                       content: content,
                   	success:function(layero, index){
                   		hsw.hsw_post(HSW_API_MANAGE_PEIMISSION_INFO.replace("pid",obj.data.pid), {}, function(data) {
                   		
                   			editInit(data);
                   			
                   		});
						},
					});
						
                }
            });
		
        });
</script>